<template>
  <div>
      <m-tabbar v-model="selected">
          <m-tabbar-item id="tab1">
              <img src="../assets/home_tabbar.png" alt="" slot="icon-normal">
              <img src="../assets/home_tabbar_selected.png" alt="" slot="icon-active">
              首页
          </m-tabbar-item>
          <m-tabbar-item id="tab2">
              <img src="../assets/home_tabbar.png" alt="" slot="icon-normal">
              <img src="../assets/home_tabbar_selected.png" alt="" slot="icon-active">
              广播
          </m-tabbar-item>
          <m-tabbar-item id="tab3">
              <img src="../assets/home_tabbar.png" alt="" slot="icon-normal">
              <img src="../assets/home_tabbar_selected.png" alt="" slot="icon-active">
              小组
          </m-tabbar-item>
          <m-tabbar-item id="tab4">
              <img src="../assets/home_tabbar.png" alt="" slot="icon-normal">
              <img src="../assets/home_tabbar_selected.png" alt="" slot="icon-active">
              我的
          </m-tabbar-item>
      </m-tabbar>
  </div>
</template>

<script>
import mTabbar from '../components/tabbar/tabbar'
import mTabbarItem from '../components/tabbar/tabbar-item'
export default {
  name: 'Index',
  components: {
    mTabbar,
    mTabbarItem
  },
  data () {
    return {
      selected: 'tab1'
    }
  }
}
</script>
